<template>
  <div class="app-container">
    <h3>tinymce富文本</h3>
    <div>
      <tinymce v-model="content" :height="300" />
    </div>
    <div class="editor-content" v-html="content" />
  </div>
</template>

<script>
  import Tinymce from "@/components/Tinymce/index.vue";
  import { reactive, toRefs, ref, watch, onMounted } from "vue";
  export default {
    name: "TinymceEditor",
    components: { Tinymce },
    setup() {
      const state = reactive({
        content: "赋值不了。。。",
        valuecont: "",
      });
      watch(
        () => state.content,
        () => {
          console.log("state.content");
        }
      );
      onMounted(() => {});
      return {
        ...toRefs(state),
      };
    },
  };
</script>

<style scoped>
  .editor-content {
    margin-top: 20px;
  }
</style>
